<%@page contentType="text/html; charset=UTF-8" trimDirectiveWhitespaces="true" pageEncoding="UTF-8"%>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>IPS-FMEA</title>
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/login/css/normalize.css" />
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/login/css/demo.css" />
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/static/login/css/component.css" />
    <style>
        img {
            width: 150px;
            height: 30px;
            position: absolute;
            left: 30px;
            top: 50px;
        }
    </style>
    <script type="text/javascript">
        function checkParent() {
            if (window.parent.length > 0) {
                window.parent.location = "login.jsp";
            }
        }
    </script>
</head>

<body onload="checkParent();">
    <div class="container demo-1">
        <div class="content">
            <div id="large-header" class="large-header">
                <div class="row">
                    <a href="http://www.cnmar.com"><img src="${pageContext.request.contextPath}/static/login/img/logo.png"/></a>
                </div>
                <input type="hidden" id="msg" value="${param.msg}">
                <canvas id="demo-canvas"></canvas>
                <div class="logo_box">
                    <h1><center>IPS 智能项目管理系统</center></h1>
                    <h2><center>SaaS版</center></h2>
                    <form action="${pageContext.request.contextPath}/loginAuth" class="layui-form" id="loginForm" name="f" method="post">
                        <div class="input_outer">
                            <span class="u_user"></span>
                            <input name="username" class="text" id="username" style="color: #FFFFFF !important" lay-verify="required" type="text" autocomplete="off" placeholder="请输入账户">
                        </div>
                        <div class="input_outer">
                            <span class="us_uer"></span>
                            <input name="password" class="text" id="password" style="color: #FFFFFF !important; position:absolute; z-index:100;" lay-verify="required" type="password" autocomplete="off" placeholder="请输入密码">
                        </div>
                        <div class="input_outer" style="width: 200px; display: inline-block">
                            <span class="u_code"></span>
                            <input type="text" name="vercode" id="verity" lay-verify="required" placeholder="图形验证码" autocomplete="off" class="text" style="color: #FFFFFF !important;">
                            <input type="hidden" id="verityc">
                        </div>
                        <div style="display: inline-block">
                            <span id="discode"></span>
                            <a href="#" onClick="createCode()"><font color="white">换一换</font></a>
                        </div>
                        <div class="mb2"><a id="login" class="act-but submit" lay-submit lay-filter="login" style="color: #FFFFFF">登录</a></div>
                    </form>
                    <div style="  color: white;text-align: center; font-size: 0.85em; margin-top: 50px;">
                        © 2020 &nbsp;&nbsp;上海洲马网络科技有限公司 &nbsp;&nbsp;版权所有
                    </div>
                </div>

            </div>
        </div>
    </div><!-- /container -->
    <script src="${pageContext.request.contextPath}/static/login/js/TweenLite.min.js"></script>
    <script src="${pageContext.request.contextPath}/static/login/js/EasePack.min.js"></script>
    <script src="${pageContext.request.contextPath}/static/login/js/rAF.js"></script>
    <script src="${pageContext.request.contextPath}/static/login/js/demo-1.js"></script>
    <script src="${pageContext.request.contextPath}/static/admin/layui/layui.js" type="text/javascript" charset="utf-8"></script>
    <script>
        layui.use(['form', 'layedit', 'laydate', 'jquery'], function() {
            var form = layui.form,
                layer = layui.layer,
                $ = layui.jquery;

            //自定义验证规则
            /*form.verify({
                title: function(value) {
                    if(value.length < 5) {
                        return '标题至少得5个字符啊';
                    }
                },
                password: [/(.+){6,12}$/, '密码必须6到12位'],
                verity: [/(.+){4}$/, '验证码必须是4位'],
            });*/

            //监听提交
            form.on('submit(login)', function(data) {
                var inputCode = document.getElementById("verity").value.toUpperCase();
                if (inputCode != code) {
                    layer.msg("验证码错误");
                    createCode();
                    document.getElementById("verity").value = "";
                    return false;
                } else {
                    var form = document.getElementById('loginForm');
                    form.submit();
                    return false;
                }
            });


            $('#username').on('keydown', function (event) {
                if (event.keyCode == 13) {
                    $("#login").trigger("click");
                    return false
                }
            });

            $('#password').on('keydown', function (event) {
                if (event.keyCode == 13) {
                    $("#login").trigger("click");
                    return false
                }
            });

            $('#verity').on('keydown', function (event) {
                if (event.keyCode == 13) {
                    $("#login").trigger("click");
                    return false
                }
            });

            var msg = document.getElementById("msg").value;
            if (msg == 1) {
                layer.msg("用户名或密码错误");
                return false;
            }
        });

        var code ;
        window.onload = createCode;
        function createCode(){
            code = "";
            var codeLength = 4;
            var random = new Array(0,1,2,3,4,5,6,7,8,9,'A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R',
                'S','T','U','V','W','X','Y','Z');
            for(var i = 0; i < codeLength; i++) {
                var index = Math.floor(Math.random() * 36);
                code += random[index];
            }
            document.getElementById("discode").style.fontFamily = "Fixedsys";
            document.getElementById("discode").style.letterSpacing = "5px";
            document.getElementById("discode").style.color = "FF0000";
            document.getElementById("discode").innerHTML = code;
            document.getElementById("verityc").value = code;
        }
    </script>
</body>
</html>
